<template>
    <div id="changePWD">
        <el-form :model="pwdobj" label-width="120px">
            <el-form-item label="原密码">
                <el-input type="password" v-model="pwdobj.sourcePassword" />
            </el-form-item>
            <el-form-item label="新密码">
                <el-input type="password" v-model="pwdobj.newPassword" />
            </el-form-item>
            <el-form-item label="确认密码">
                <el-input type="password" v-model="checkpwd" />
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="updword()">保存修改</el-button>
            </el-form-item>
        </el-form>
        <div style="color: red;width: 350px;margin: 0 auto;">
            提示：为防止弱口令问题，密码设置需要同时由大写字母,小写字母,符号和数字组成且长度不少于8位，例如Hnrk#756。
        </div>
    </div>
</template>

<script setup>
import { ElMessage } from 'element-plus';
import { onMounted, reactive } from 'vue';
import { useRouter } from 'vue-router';
import $sys from '../../api/sys';
const $router = useRouter();
const pwdobj = reactive({});
const checkpwd = ref("");
let zz=/^(?=.*[a-zA-Z])(?=.*\d)(?=.*[!@#$%^&*(),.?":{}|<>+\-_])[\da-zA-Z!@#$%^&*(),.?":{}|<>+\-_]{8,}$/
onMounted(() => {

});
function updword() {
    if (checkobj()) {
        // console.log(pwdobj);
        $sys.changePWD(pwdobj).then(res => {
            if (res.code == 200) {
                ElMessage({
                    message: '操作成功,请重新登录！',
                    type: 'success'
                });
                localStorage.removeItem('token');
                localStorage.removeItem('password');
                setTimeout(() => {
                    $router.replace({
                        name: 'login'
                    });
                },200);   
            } else {
                ElMessage({
                    message: res.message,
                    type:'warning'
                })
            }
        });
    }
}
function checkobj() {
    let flag = false;
    if (pwdobj.sourcePassword == "" || !pwdobj.sourcePassword) {
        ElMessage({
            message: '请输入原密码!',
            type: 'warning'
        });
        flag = false;
    } else if (pwdobj.newPassword == "" || !pwdobj.newPassword) {
        ElMessage({
            message: '请输入新密码!',
            type: 'warning'
        });
        flag = false;
    } else if (checkpwd.value == "") {
        ElMessage({
            message: '请输入确认密码!',
            type: 'warning'
        });
        flag = false;
    } else if (!zz.test(pwdobj.newPassword)) {
        ElMessage({
            message: '密码必须包含至少一个数字,字母和特殊字符,且长度不小于8位!',
            type:'warning'
        })
    } else if (pwdobj.newPassword != checkpwd.value) {
        ElMessage({
            message: '两次输入密码不一致!',
            type: 'warning'
        });
        flag = false;
    } else {
        flag = true;
    }
    return flag;
}
</script>

<style lang="less">
#changePWD{
    padding: 20px 0 0 20px;
    width: 400px;
}
</style>
